import {View} from "@tarojs/components";
import {Button, Cell, Empty, Image, Search} from "@antmjs/vantui";
import Utils from "@/utils/common";
import React, {useCallback, useEffect, useRef, useState} from "react";
import {AddressModel, IdParams, UserinfoModel} from "@/common/apis/model";
import {byMobileApi, teamRelationSaveApi} from "@/common/apis/home_datasource";

import LocalUtils from "@/utils/local_utils";
import Taro from "@tarojs/taro";

definePageConfig({
  navigationBarTitleText: '添加成员'
})

export default function Search_user() {

  const [items, setItems] = useState<UserinfoModel>()


  const inputKey = useRef('');
  const idParams = useRef<IdParams>();

  const searchAction = useCallback((e) => {
    if (!Utils.isNotBlank(e.detail)) {
      Utils.showErrorToast('请输入手机号')
      return;
    }
    if (e.detail === inputKey.current) {
      return;
    }
    inputKey.current = e.detail;
    byMobileApi(inputKey.current).then((res) => {
      setItems(res)
    })
  }, []);

  const channel = useRef<Taro.EventChannel | null>();

  useEffect(() => {
    const instance = Taro.getCurrentInstance();
    channel.current = Utils.getChannel(instance);
    if (instance && instance.router) {
      const params = instance.router.params;
      if (params.data) {
        idParams.current = Utils.getObjectWithUrl<IdParams>(params.data)
      }
    }
  }, []);


  return (
    <View style={{display: 'flex', flexDirection: 'column', height: '100vh'}}>
      <View>
        <Search
          placeholder='请输入用户手机号'
          onSearch={searchAction}
        />
      </View>
      <View style={{flex: 1}}>
        {items ? <View><Cell renderIcon={<Image src={items.avatar}
                                                style={{
                                                  width: '30px',
                                                  height: '30px',
                                                  borderRadius: '50%',
                                                  marginRight: '10px'
                                                }}
        />}
                             title={items.username} key={items.id}
                             renderExtra={<Button type='primary' size='mini' onClick={() => {
                               if (items && idParams.current) {
                                 teamRelationSaveApi(idParams.current.id, items.id).then((res) => {
                                   //17601018908
                                   if (res) {
                                     Utils.showOkToast('添加成功')
                                     if (channel.current) {
                                       channel.current.emit('addMember', items)
                                       Utils.navigateBack()
                                     }
                                   }
                                 })
                               }
                             }}>添加</Button>}
        /></View> : <Empty description='暂无数据'/>}
      </View>
    </View>
  )
}

